<template>
  <el-icon :size="props.size" :color="props.color"
    ><component :is="name"
  /></el-icon>
</template>

<script setup lang="ts">
import { computed } from "vue";
import LineMd from "./config/lineMd";
import Meteocons from "./config/meteocons";
import Normal from "./config/normal";
type PropsType = {
  icon: string;
  size?: number;
  color?: string;
};

const props = withDefaults(defineProps<PropsType>(), {
  icon: "",
  size: 25,
  color: "#ccc",
});

let name = computed(() => {
  return { ...LineMd, ...Meteocons, ...Normal }[props.icon];
});
</script>

<style scoped lang="scss"></style>
